<template>
    <div>
        <h1 style="text-align:center;">
            修改账号
        </h1>
        <!--新增界面-->
			<el-form label-width="70px" :rules="formRules" ref="form"  :model="form" >
				<el-form-item label="用户名" >
                    {{form.username}}
				</el-form-item>
				<el-form-item label="密码" prop="password">
					<el-input v-model="form.password" auto-complete="off"></el-input>
				</el-form-item>
                <el-form-item label="用户类型">
                    <span> {{form.level}}级用户</span>
                </el-form-item>
				<el-form-item label="手机号" prop="phone">
					<el-input v-model.number="form.phone" auto-complete="off" ></el-input>
				</el-form-item>
			</el-form>
			<div slot="footer" class="dialog-footer">
                <el-button type="plain" @click.native="cancel()" >取消</el-button>
				<el-button type="primary" @click.native="submit()" :loading="addLoading">确认</el-button>
			</div>
    </div>
</template>
<script>
import {isvalidPhone} from '../../../config/validate'
import { editUser } from '../../api/api';
 //定义一个全局的变量，谁用谁知道
  var validPhone=(rule, value,callback)=>{
      if (value &&　isvalidPhone(value)){
       	callback()
      }else {
        callback(new Error())
      }
  }
let data;
export default {
    data(){
      return{
        addLoading: false,
        formRules: {
            password: [
                { required: true, message: '请输入密码', trigger: 'blur'}
			],
			phone:[
				{ required: true, message: '请输入正确的11位手机号码',validator: validPhone, trigger: 'blur'}
			]
         },
        //界面数据
         form: {
            username:'',
			phone:'',
            password:'',
            level:''
        }
      }  
    },
    created(){
        data = JSON.parse(sessionStorage.getItem('data'));
         this.form =  {
            username:data['name'],
			phone:data['phone'],
            password:data['password'],
            level:data['level']
        }
    },
    mounted(){
        this.getLevel();
    },
	methods:{
        cancel(){
            this.$router.replace('/checkaccount');
        },
        getLevel(){
            switch(this.form.level){
                case 1:
                    this.form.level = '一';
                break;
                case 2:
                    this.form.level = '二';
                break;
                case 3:
                    this.form.level = '三';
                break;
            }
        },
		//新增
		submit: function () {
			this.$refs.form.validate((valid) => {
				if (valid) {
					this.$confirm('确认提交吗？', '提示', {}).then(() => {
						this.addLoading = true;
                        //NProgress.start();
                        let para = Object.assign({}, this.form);
                        console.log(para);
						editUser(para).then((res) => {
							this.addLoading = false;
							//NProgress.done();
							this.$message({
								message: '提交成功',
								type: 'success'
							});
							this.formVisible = false;
					//		this.getUsers();
						});
					});
				}
			});
		},
	}
  
}
</script>
<style lang="scss" scoped>
.content-wrapper>div{
	width: 380px;
	position: absolute;
	top:50%;
	left: 50%;
	margin: -200px 0 0 -100px;
	padding: 20px;
	border: 1px solid #eaeaea;

    .el-form-item{
        text-align: center;
    }
	.dialog-footer{
		text-align: center;
	}
}
</style>
